<!--
 * @Description: 
 * @Date: 2022-07-07 11:45:05
 * @LastEditTime: 2022-07-11 14:33:06
 * @FilePath: \jsnode\css\paddingTest.html
-->
<!DOCTYPE html>
<html>

<head>
    <style>
        .css1 {
            background-color: green;
            width: 100px;
            height: 100px;
            padding: 20px;
            margin: 50px;
        }

        .css11 {
            background-color: green;
            width: 100px;
            height: 100px;
            padding: 20px;
            margin: 50px;
            border: 20px red solid;
        }

        .css2 {
            background-color: green;
            width: 100px;
            height: 100px;
            box-sizing: content-box;
            padding: 20px;
            margin: 50px;
        }

        .css22 {
            background-color: green;
            width: 60px;
            height: 60px;
            box-sizing: content-box;
            padding: 20px;
            margin: 50px;
        }

        .css3 {
            background-color: green;
            width: 100px;
            height: 100px;
            box-sizing: border-box;
            padding: 20px;
            margin: 50px;
        }

        .css4 {
            background-color: green;
            width: 100px;
            height: 100px;
            box-sizing: border-box;
            padding: 20px;
            margin: 50px;
            border: 20px red solid;
            font-size: 12px;
        }

        .css5 {
            background-color: green;
            width: 100px;
            height: 100px;
            box-sizing: inherit;
            padding: 20px;
            margin: 50px;
            border: 20px red solid;
            direction: ltr;
            unicode-bidi: isolate-override;
            font-size: 8px;
        }

        .css6 {
            font-size: 12px;
            color: red;
        }

        .css7 {
            font-size: 8px;
            color: green;
            -webkit-transform: scale(0.5);
            transform: scale(0.5);

        }

        .css8 {
            font-size: 8px;
            color: green;
            -webkit-transform: scale(0.5);
            transform: scale(0.5);
            display: inline-block;
        }
    </style>
</head>

<body style="background-color: #909090;">
    <div class="css1">
        heiheiheiwo
    </div>
    <div class="css11">
        heiheiheiwo
    </div>
    <div class="css2">
        heiheiheiwo
    </div>
    <div class="css22">
        heiheiheiwo
    </div>
    <div class="css3">
        heiheiheiwo
    </div>
    <div class="css4">
        heiheiheiwo
    </div>
    <div class="css5">
        heiheiheiwo
    </div>
    <div class="css6">
        我是12号字体
    </div>
    <div class="css7">
        我是8号字体
    </div>
    <span class="css8">
        我是8号字体
    </span>
</body>

</html>